<!doctype html>
<#assign ctx=request.contextPath>
<html>
<head>
<meta charset="utf-8">
<#include "header.html"/>
<#import "/macros/header_macro.html" as muyaxuan_header>
<title>支付页面</title>
<link rel="stylesheet" type="text/css" href="${ctx}/css/payment.css">
<link rel="stylesheet" type="text/css" href="${ctx}/css/header1.css">
<script type="text/javascript">
       $(function(){
           $("#queren").click(function(){
             
              var input = $("input[class^='pwd']");
              var orderId=$("#orderId").val();
              var pwd=input.map(function(){
                 return this.value;
              });
              var url="${ctx}/customer/payAjax?password="+pwd.get();
              var params={id:orderId};
             $.post(url,params,function(data){
                   if(data.status==0){
                         window.location="${ctx}/pages/success.html";
                   }else{
                        alert(data.tip);
                   }
             },"json");
           });
       
       }); 


</script>
</head>
<!--[if lt IE 9]>
<script src="js/IE9.js"></script>
<![endif]-->
<body>
 <!--头部开始-->
<!--头部导航栏-->
 <@muyaxuan_header.header ctx="${ctx}"/>
<!--头部结尾-->

<!--中间内容部分-->
<div class="centent">
    <ul class="nav_a">
    <li>购物车</li>
    <li>确认订单</li>
    <li>支付订单</li>
    <li>支付页</li>
    </ul>
    <h3>选择支付方式</h3>
    <div class="case">
    <form>
      <ul>
      <li><input type="radio" id="radio1" name="radio" value="1" checked style="cursor:pointer;" />
      <label for="radio1"><img src="${ctx}/images/zfb.png" style="cursor:pointer"/></label></li>
      <li><input type="radio" id="radio2" name="radio" value="2" style="cursor:pointer" />
      <label for="radio2"><img src="${ctx}/images/zgyl.png" style="cursor:pointer"/></label></li>  
      <li><input type="radio" id="radio3" name="radio" value="3" style="cursor:pointer" />
      <label for="radio3"><img src="${ctx}/images/dfzf.png" style="cursor:pointer"/></label></li>
      <li><input type="radio" id="radio4" name="radio" value="4" style="cursor:pointer" />
      <label for="radio4"><img src="${ctx}/images/dzzf.png" style="cursor:pointer"/></label></li>
      </ul>
      
      
      <p><input id="other" type="submit" name="submit" value="其他支付方式" style="cursor:pointer"/>
      <input id="bank" type="button" name="button" value="+ 银行卡" style="cursor:pointer"/></p>
      <div class="cle"></div>
    </form>
    <div class="cle"></div>
    <p><img class="user" src="${ctx}/images/dgt.png"/><span>你在安全的环境中，请放心使用！</span></p>
    <p id="p4">支付宝支付密码：</p>
    <form action="" method="post" id="upass">
    <input type="password" name="upass" maxlength="1" class="pwd"/>
    <input type="password" name="upass" maxlength="1" class="pwd"/>
    <input type="password" name="upass" maxlength="1" class="pwd"/>
    <input type="password" name="upass" maxlength="1" class="pwd"/>
    <input type="password" name="upass" maxlength="1" class="pwd"/>
    <input type="password" name="upass" maxlength="1" class="pwd"/>
    <a href="">忘记密码？</a>
   </form>
   <form action="" method="post">
   <input type="hidden" value="${order.id}" id="orderId"/> 
   <input type="button" value="确认付款" id="queren"/>
   </form>
    </div>
    <h3>订单详情</h3>
    <div class="orlist">
        <ul>
         <li>订单编码</li>
         <li>下单时间</li>
         <li>送货信息</li>
         <li>总额（元）</li>
         <li>收货状态</li>
         <li>支付状态</li>
        </ul>
       </div>
    <div class="orcent">
        <ul>
         <li>
          <ul>
           <li>${order.orderCode}</li>
           <li>${order.createDate?string("yyyy-MM-dd HH:mm:ss")}</li>
           <li>
           <#if order.tradingStatus=0>
                 未发货
           </#if>
           </li>
           <li>${order.totalAmount}</li>
           <li>等待付款</li>
           <li>
           <#if order.alipay==0>
                 未付款
           </#if>
           </li>
          </ul>
         </li>
         </ul>
      
        
       
        
       
       
         
       </div>
    <div class="cle"></div>
</div>
<!--尾部开始-->
<div class="footer">
 <div class="tfoot">
  <div class="cust">
   <ul>
   <li>
      <img src="${ctx}/images/cust-logo1.png">
     <h1>品质保障</h1>
     <p>品质护航 购物无忧</p>
   </li>
   <li>
     <img src="${ctx}/images/cust-logo2.png">
     <h1>七天无理由退换货</h1>
     <p>为您提供售后无忧保障</p>
   </li>
   <li>
     <img src="${ctx}/images/cust-logo3.png">
     <h1>正品行货</h1>
     <p>轻松购物</p>
   </li>
   <li>
     <img src="${ctx}/images/cust-logo4.png">
     <h1>天天低价</h1>
     <p>提供性价比高的货物</p>
   </li>
  </ul>
  </div>
  <div class="fcata">
    <ul>
      <li>
       <dl>
        <dt><a href="#">新手上路</a></dt>
        <dd><a href="#">订购方式</a></dd>
        <dd><a href="#">购物流程</a></dd>
        <dd><a href="#">售后流程</a></dd>
       </dl>
      </li>
      <li>
       <dl>
        <dt><a href="#">配送与支付</a></dt>
        <dd><a href="#">货到付款区域</a></dd>
        <dd><a href="#">支付方式说明</a></dd>
        <dd><a href="#">新手上路教程</a></dd>
       </dl>
      </li>
      <li>
       <dl>
        <dt><a href="#">会员中心</a></dt>
        <dd><a href="#">资金管理</a></dd>
        <dd><a href="#">我的收藏</a></dd>
        <dd><a href="#">我的订单</a></dd>
       </dl>
      </li>
      <li>
       <dl>
        <dt><a href="#">服务保证</a></dt>
        <dd><a href="#">退换货原则</a></dd>
        <dd><a href="#">售后服务保证</a></dd>
        <dd><a href="#">品质保证</a></dd>
       </dl>
      </li>
      <li>
       <dl>  
        <dt><a href="#">关于我们</a></dt>
        <dd><a href="#">公司简介</a></dd>
        <dd><a href="#">发展历程</a></dd>
       </dl>
      </li>
     </ul>
  </div>
 </div>
 <div class="bfoot">
   <p>
    <a href="#">免责条款</a>
    <a href="#">隐身保护</a>
    <a href="#">招聘英才</a>
    <a href="#">联系我们</a>
    <a href="#">公司简介</a>
    <a href="#">批发方案</a>
    <a href="#">配送方式</a>
    <a href="#">留言板</a>
   </p>
   
   <h1>Copyright ? 2003-2016 muyaxuan.net, All Rights Reserved</h1>
  </div>
</div>
<!--尾部结尾-->
</body>
</html>
<script src="${ctx}/js/header.js"></script>
<script src="${ctx}/js/pay.js"></script>